<include file="header"/>
<link rel="stylesheet" type="text/css" href="/assets/base/bonsai/css/swiper.min.css">
<style>
    .clickable-div 
    {
         cursor: pointer;
    }
</style>
<body>
<div class="wraper">
	<div class="top-nav tb-mode">
		<p class="tb-cell"><a href="javascript:history.go(-1);" class="nav-menu"><span class="iconfont icon-fanhui72"></span></a></p>
		<p class="tb-cell text-right">
			<a href="{BEESCRM::U('base/bonsai/cart', array('wechat_id'=>$wechat_id, 'origin'=>$origin))}" class="nav-menu"><span class="iconfont icon-shopcar"></span></a>
			<a href="{BEESCRM::U('base/bonsai/index', array('wechat_id'=>$wechat_id, 'origin'=>$origin))}" class="nav-menu"><span class="iconfont icon-home"></span></a>
		</p>
	</div>
	<if condition="$data['GoodsImage']">
		<div class="banner">
			<div class="swiper-container">
				<div class="swiper-wrapper">
				<volist name="data.GoodsImage" id="vo">
					<div class="swiper-slide"><a href="javascript:;"><img src="{BEESCRM:$vo.image_url}"></a></div>
				</volist>
				</div>
				<div class="swiper-pagination"></div>
			</div>
		</div>
	</if>
	<div class="tb-mode white-block">
		<div class="tb-cell">
			<p class="text-green">{BEESCRM:$data.goods_name}</p>
			<p class="sub-contain">{BEESCRM:$data.intro}</p>
			<input name="goodsId" id="goodsId" type="hidden" value="{BEESCRM:$data.goods_id}"/>
		</div>
		<p id="collection" class='tb-cell text-right <eq name="data.is_collected" value="1">text-red<else/>text-gray</eq> '>收藏<span class="iconfont icon-shoucangyishoucang"></span><span id="collection_count">{BEESCRM:$data.collection}</span></p>
	</div>
	<div class="contain">
		<div class="check-box clearfix">
		
		<if condition="(($goodstype eq 2) ||($data['type'] eq 2))">
			<div class='check-list pull-left checked long-check' data-type='2'>
				 会场布置  <span class="sub-contain"><span class="text-red">{BEESCRM:$data.meetingplace_price} 元</span>/盆/场</span>
				<span class="iconfont icon-xuanzedianjihou"></span>
			</div>
		<elseif condition="(($goodstype eq 3)||($data['type'] eq 3))"/>
		
			<div class='check-list pull-left checked long-check' data-type='3'>
				长期摆放  <span class="sub-contain"><span class="text-red">{BEESCRM:$data.long_price} 元</span>/盆/天</span>
				<span class="iconfont icon-xuanzedianjihou"></span>
			</div>
			
		<elseif condition="((!$goodstype)||($data['type'] eq 1))"/>
			<!-- 可能来源于分享 无cookie -->
			<div class='check-list pull-left checked' data-type='2'>
				 会场布置  <span class="sub-contain"><span class="text-red">{BEESCRM:$data.meetingplace_price} 元</span>/盆/场</span>
				<span class="iconfont icon-xuanzedianjihou"></span>
			</div>
			
			<div class='check-list pull-left' data-type='3'>
				长期摆放  <span class="sub-contain"><span class="text-red">{BEESCRM:$data.long_price} 元</span>/盆/天</span>
				<span class="iconfont icon-xuanzedianjihou"></span>
			</div>
		</if>
			<!-- <div class='check-list pull-left <if condition="(($goodstype eq 2) ||($data.type eq 2))">checked</if>' data-type='2'>
				 会场布置  <span class="sub-contain"><span class="text-red">{BEESCRM:$data.meetingplace_price} 元</span>/盆/场</span>
				<span class="iconfont icon-xuanzedianjihou"></span>
			</div>
			
			<div class='check-list pull-left <if condition="(($goodstype eq 3)||($data.type eq 3))">checked</if>' data-type='3'>
				长期摆放  <span class="sub-contain"><span class="text-red">{BEESCRM:$data.long_price} 元</span>/盆/天</span>
				<span class="iconfont icon-xuanzedianjihou"></span>
			</div> -->
			
		</div>
		<div class="tb-mode white-block">
			<p class="tb-cell">选择商品数量</p>
			<div class="tb-cell">
				<div class="quantity tb-mode pull-right">
					<span class="iconfont icon-iconfont55 tb-cell change-num-btn clickable-div" data-status="sub" style="cursor:pointer;"></span>
					<input type="number" value="1" id="buy-num" data-status="input" autocomplete="on">
					<span class="iconfont icon-jia tb-cell change-num-btn" data-status="plus" style="cursor:pointer;"></span>
				</div>
			</div>
		</div>
	</div>

	<div class="text-contain">
		<p class="contain-title">植物简介</p>
		{BEESCRM:$data.goods_detail}
	</div>

	<div class="fixed-btn">
		<a href="javascript:;" class="btn btn-red buynow">立即预约</a>
		<a href="javascript:;" class="btn btn-green addtocart">加入预约篮</a>
	</div>
</div>
<include file="commonJs"/>
<script src="/assets/base/bonsai/js/swiper.min.js"></script>
<script>
	var fix_h= $('.fixed-btn').outerHeight();
	$('.wraper').css('paddingBottom',fix_h+8);

	var swiper = new Swiper('.banner .swiper-container', {
		pagination: '.banner .swiper-pagination',
		paginationClickable: true,
		spaceBetween: 0,
		centeredSlides: true,
		autoplay: 2500,
		autoplayDisableOnInteraction: false,
		loop: true
	});
	
	$(function(){
		$('.check-box').on('click', '.check-list', function(){
			$(this).addClass('checked').siblings().removeClass('checked');
		})
	});
	
	//收藏，取消商品
	$('.icon-shoucangyishoucang').click(function(){
		var goodsId = $('#goodsId').val();
		var data = {}, json = {};
		data.goods_id = goodsId;
		json.method = 'post';
		json.type = 'json';
		json.url = "{BEESCRM::U('/base/bonsai/addCollection', array('wechat_id'=>$wechat_id))}";
		json.data = data;
		$.getAjax(json, true, change, '');
	});
	
	function change(data){
		var collection_count = $('#collection_count').html();
		if(data.item == 2){
			$('#collection_count').html(++collection_count);
			$('#collection').removeClass('text-gray').addClass('text-red');
		}else {
			$('#collection_count').html(--collection_count);
			$('#collection').removeClass('text-red').addClass('text-gray');
		}
	}
	
	//$(function(){
	$(document).ready(function(){
		//var elem = $('.quantity')
		var elem = $(document);
		//数量增减
          elem.on('click', '.change-num-btn', function () {
              var id = $(this).data('id')
              var status = $(this).data('status');
              renderNumVal(id, status);
          });
		//输入数量
          elem.on('change', '#buy-num', function () {
              var id = $(this).data('id');
              var status = $(this).data('status');
              renderNumVal(id, status);
          });

          function renderNumVal(id, status) {
              var initNum = $('#buy-num').val();

              if (status == 'plus') {
                  initNum++;
              } else if (status == 'sub') {
                  if (initNum <= 1) {
                      initNum = 1;
                      return false;
                  }
                  initNum--;
              } else if (status == 'input') {
                  initNum = $('#buy-num').val();
                  if (initNum <= 1) {
                      initNum = 1;
                      $('#buy-num').val(initNum);
                  }
              }
            $('#buy-num').val(initNum);
    	}
	});
	
	//加入购物车
	$('.addtocart').click(function(){
		var goodsId = $('#goodsId').val();
		var number = $('#buy-num').val();
		var type = $('.checked').data('type');
		var numReg = /^\+?[1-9][0-9]*$/;
		if(!goodsId){
			$.alert('error', '商品ID参数有误，请刷新重试~');return ;
		}else if(!numReg.test(number) || isNaN(number)){
        	$.alert('error', '请选择正确的商品数量');return ;
        }else if(!type){
        	$.alert('error', '商品类型参数有误，请刷新重试~');return ;
        }
		var data = {}, json = {};
		data.goods_id = goodsId;
		data.goods_num = number;
		data.type = type;
		data.label = 'cart';
		json.method = 'post';
		json.type = 'json';
		json.url = "{BEESCRM::U('/base/bonsai/addToCart', array('wechat_id'=>$wechat_id, 'origin' => $origin))}";
		json.data = data;
		$.getAjax(json, true, '', '');
		
	});
	
	
	//加入购物车
	$('.buynow').click(function(){
		var goodsId = $('#goodsId').val();
		var number = $('#buy-num').val();
		var type = $('.checked').data('type');
		var numReg = /^\+?[1-9][0-9]*$/;
		if(!goodsId){
			$.alert('error', '商品ID参数有误，请刷新重试~');return ;
		}else if(!numReg.test(number) || isNaN(number)){
        	$.alert('error', '请选择正确的商品数量');return ;
        }else if(!type){
        	$.alert('error', '商品类型参数有误，请刷新重试~');return ;
        }
		var data = {}, json = {};
		data.goods_id = goodsId;
		data.goods_num = number;
		data.type = type;
		data.label = 'buy';
		json.method = 'post';
		json.type = 'json';
		json.url = "{BEESCRM::U('base/bonsai/addToCart', array('wechat_id'=>$wechat_id, 'origin' => $origin))}";
		json.data = data;
		$.getAjax(json, false, refresh, '');
	});
	
	function refresh(data){
		console.log(data); 
		setTimeout('location.href="'+data.url+'"', 1000);
	}
</script>
</body>
</html>
